<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<c:set var="ctx" value="${pageContext.request.contextPath }"></c:set>
<!DOCTYPE html>
<html lang="en">
<c:import url="../common/header.jsp"></c:import>
<body class="hold-transition skin-blue sidebar-mini">
	<div class="wrapper">

		<c:import url="../common/nav.jsp"></c:import>

		<!-- Content Wrapper. Contains page content -->
		<div class="content-wrapper">
			<!-- Content Header (Page header) -->
			<section class="content-header">
				<h1>
					监控信息配置<small></small>
				</h1>
				<ol class="breadcrumb">
					<li><a href="#"><i class="fa fa-dashboard"></i> Level</a></li>
					<li class="active">Here</li>
				</ol>
			</section>

			<!-- Main content -->
			<section class="content">

				<!-- Your Page Content Here -->
				<div class="row">
					<div class="col-xs-12">

						<div class="box">
							<div class="box-header">
								<h3 class="box-title"></h3>
							</div>
							<!-- /.box-header -->
							<div class="box-body">

								<div class="form-horizontal">
									<div class="form-group">
										<div class="col-sm-4"></div>
										<div class="col-sm-3">该爬取程序每小时更新一次</div>

									</div>
									<div class="form-group">
										<label for="city" class="col-sm-3 control-label">城市</label>
										<div class="col-sm-4">
											<input type="citys" class="form-control" placeholder="citys"
												readonly="readonly" value="广州" id="citys">
										</div>
									</div>
									<div class="form-group">
										<label for="keywords" class="col-sm-3 control-label">关键词</label>
										<div class="col-sm-4">
											<input type="keywords" class="form-control" id="keywords"
												placeholder="keywords" value="${keywords}">

										</div>
										<div class="col-sm-2">
											<span>当前有${keysize}个关键词</span>
										</div>

									</div>


									<div class="form-group">
										<div class="col-sm-offset-3 col-sm-3">
											<button class="btn btn-default" id="update">保存配置</button>
										</div>
										<%-- <div class="col-sm-3">
											<button class="btn btn-default" id="spider"
												name="${ctx }/start/all">启动爬虫</button>
										</div> --%>
									</div>
								</div>

							</div>
							<!-- /.box-body -->
						</div>
						<!-- /.box -->
					</div>
					<!-- /.col -->
				</div>
				<!-- /.row -->
			</section>
			<!-- /.content -->
		</div>
		<!-- /.content-wrapper -->

		<%-- 		<c:import url="../common/footer.jsp"></c:import> --%>

		<!-- jQuery 2.2.3 -->
		<script src="${ctx}/plugins/jQuery/jquery-2.2.3.min.js"></script>
		<!-- Bootstrap 3.3.6 -->
		<script src="${ctx}/bootstrap/js/bootstrap.min.js"></script>
		<!-- DataTables -->
		<script src="${ctx}/plugins/datatables/jquery.dataTables.min.js"></script>
		<script src="${ctx}/plugins/datatables/dataTables.bootstrap.min.js"></script>
		<!-- SlimScroll -->
		<script src="${ctx}/plugins/slimScroll/jquery.slimscroll.min.js"></script>
		<!-- FastClick -->
		<script src="${ctx}/plugins/fastclick/fastclick.js"></script>
		<!-- AdminLTE App -->
		<script src="${ctx}/dist/js/app.min.js"></script>
		<!-- AdminLTE for demo purposes -->
		<script src="${ctx}/dist/js/demo.js"></script>

		<!-- page script -->
		<script>
			$(function() {
				$("#spider").click(function() {

					$.ajax({
						url : $(this).attr("name"),
						success : function(data) {
							data = $.parseJSON(data);
							if (data == 200) {
								alert("启动成功");
							} else if (data == 300) {
								alert("爬虫已经启动！");
							} else {
								alert("启动失败");
							}
							/* window.location.reload(); */
						}
					});
				});

				$("#update").click(function() {

					$.post("${ctx}/settings/update", {
						citys : $("#citys").val(),
						keywords : $("#keywords").val()
					}, function(data) {
						if (data == 200) {
							window.location.reload();
						} else {
							alert(data);
						}
					}, "json");

				});

			});
		</script>
	</div>

</body>
</html>
